"use client"
import {photos} from "@/app/data";
import Image from "next/image";
// 这里是导入的 "next/navigation" 而不是 "next/router"
import {useRouter} from "next/navigation";

export default function Page({params}: { params: { id: string } }) {
    const photo = photos.find(item => item.id === +params.id)!
    const router = useRouter()
    return (
        <div className={"flex justify-center items-center fixed inset-0 bg-gray-500/[.8]"} onClick={router.back}>
            <Image src={photo.src} alt={photo.alt} width={400} height={400}
                   className={"rounded-lg"} onClick={e => e.stopPropagation()}></Image>
        </div>
    )
}
